<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<script type="text/javascript" src="js/jquery.min.js" ></script>
		<style type="text/css">
			*{
				margin: 0;
				padding: 0;
				list-style: none;
			}
			ul{
				width: 200px;
				height: 400px;
				margin: 50px auto;
			}
			li{
				width: 200px;
				text-align: center;
				height: 50px;
				line-height: 50px;
				opacity: 0;
				transition: 0.5s;
				color: white;
			}
		</style>
	</head>
	<body>
		<ul>
			<li>谢谢你能点开</li>
			<li>我只想说三句话</li>
			<li>第一句祝你幸福</li>
			<li>第二句祝你开心</li>
			<li>·</li>
			<li>·</li>
			<li>·</li>
			<li>我还是忍不住想你</li>
			<li>你看不看得见没关系</li>
			<li>我知道就行</li>
			<li>就像一开始那样</li>
		</ul>
	</body>
	<script type="text/javascript">
			var i = 0;
			setInterval(function(){
				$("li").eq(i).css("opacity","1");
				$("ul").children("li").eq(i).css("color","black")
				i++
			},3500);
	</script>
</html>
